@extends('layouts.app')
@section('content')
    <div class="content">
        <div class="row custom-invoice">
            @can('package-edit')
            <a class="btn btn-success add-attr hideForm" data-url="{{route('admin.package.attr.store')}}">添加产品类别</a>
            @endcan
            <br />
            <br />
            <table class="table table-striped table-hover">
                <thead>
                <tr>
                    <th>名称</th>
                    <th>操作</th>
                    <th>排序权重</th>
                </tr>
                </thead>
                <tbody>
                @foreach($data as $item)
                    <tr>
                        <td>{{ $item->name }}</td>
                        <td>
                            @can('package-edit')
                            <a class="btn btn-primary btn-xs hideForm" data-value="{{ $item->name }}" data-url="{{ route('admin.package.attr.update', ['id' => $item->id]) }}"><i class="fa fa-edit"></i> 编辑</a>
                            <a class="btn btn-primary btn-xs delete-confirm" data-href="{{ route('admin.package.attr.delete', ['id' => $item->id]) }}"><i class="fa fa-trash-o"></i> 删除</a>
                            @endcan
                        </td>
                        <td>
                            <input type="text" class="col-xs-3 change-sort" data-id="{{ $item->id }}" value="{{ $item->sort }}" />
                        </td>
                    </tr>
                @endforeach
                </tbody>
            </table>
            {{ $data->links() }}
        </div>

        <div class="modal fade loading custom-hide" id="hideForm" tabindex="-1" role="dialog" aria-labelledby="hideFormLibel" aria-hidden="true" data-backdrop="static" data-keyboard="false">
            <div class="modal-dialog">
                <div class="content invoice" style="text-align: left">
                    <form class='form' action="" method="POST">
                        <input type="hidden" name="_token" value="{{ csrf_token() }}" />
                        <div class="form-group">
                            <label for="money">类别名：</label>
                            <input class="form-control" type="text" name="attr" id="attr" required />
                        </div>
                        <div class="form-group">
                            <button type="submit" class="btn btn-success form-control">提交</button>
                            <br />
                            <br />
                            <button type="button" class="btn" id="closeHideForm">关闭</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection
@push('scripts')
    <script>
        $('#closeHideForm').on('click', function () {

            $("#hideForm").modal('hide');
        });

        $('.change-sort').on('change', function () {
            var sort = $(this).val();
            var id = $(this).attr('data-id');
            $.ajax({
                url: '{{ route('admin.package.attr.sort') }}',
                type: "GET",
                dataType:'json',
                data: {
                    id: id,
                    sort: sort,
                },
                success: function (re) {
                }
            });
        });

        $('.hideForm').on('click', function () {
            var action = $(this).attr('data-url');
            var value = $(this).attr('data-value');
            $("#hideForm form").attr('action', action);
            $("#attr").val(value);
            $("#hideForm").modal('show');
        });
    </script>
@endpush
